<template>
  <div id="app">
      <v-header></v-header>
      <v-centre></v-centre>
      <v-bottom></v-bottom>
      
  </div>
</template>

<script>
import hadd from './components/header.vue'
import centre from './components/centre.vue'
import bottom from './components/bottom.vue'
export default {
  components:{ 
    'v-header': hadd,
    'v-centre':centre,
    'v-bottom':bottom
  }
}
</script>

<style>
    #app {
      font-family: 'Avenir', Helvetica, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-align: center;
      color: #2c3e50;
      margin-top: 60px;
    }
  /*通用元素*/
    *{
        margin: 0px;
        padding: 0px;
        box-sizing:border-box;
    }
    a{
        text-decoration: none;
    }
    span{
        display: inline-block;
    }
    li{
        list-style: none;
    }
    /*home*/
    #app{
        width: 960px;
        margin: 0 auto;
    }
</style>
